<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>登录页面</title>
	<link rel="stylesheet" href="css/common.css">
	<link rel="stylesheet" href="css/login.css">

	<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>

</head>

<body>
	<div class="nav">
		<div class="flag">
			<img src="image/face2.png" alt="logo">
			<div class="title">日程提醒</div>
		</div>

		<div class="page">
			<a href="reg.html">注册</a>
		</div>
	</div>

	<div class="login_container">


		<div class="login_dialog">
			<div class="log_image">
				<img src="image/kangna_log2.png" alt="">

			</div>
			<table>
				<tr>
					<th colspan="2" class="denglu">登 录</th>
				</tr>
				<tr>
					<td class="t1">用户名</td>
					<td><input type="text" id="username"></td>
				</tr>
				<tr>
					<td class="t1">密码</td>
					<td><input type="password" id="password"></td>
				</tr>
				<tr>
					<td colspan="2"><input type="submit" value="提交" id="submit" onclick="login()"></td>
				</tr>
			</table>
		</div>

	</div>
	<script>
		function login() {
			// 1.参数校验
			var username = jQuery("#username");
			var password = jQuery("#password");
			if (username.val().trim() == "") {
				username.focus();
				alert("请输入用户名!")
				return false;
			}
			if (password.val().trim() == "") {
				username.focus();
				alert("请输入密码!");
				return false;
			}
			// 2.将参数提交给后端
			jQuery.ajax({
				url: "/user/login",
				type: "post",
				data: {
					"username": username.val().trim(),
					"password": password.val().trim()
				},
				success: function (res) {
					// 3.将结果返回给用户
					if (res.code == 0) {
						// 登录成功!
						// alert("登录成功!");
						// 跳转到我的文章管理页面
						location.href = "index.html";
					} else {
						// 登录失败!
						alert("登录失败，用户名或密码错误！");
					}
				}
			});

		}
	</script>
</body>

</html>